<template>
  <a-card :bordered="false">
    <a-spin :spinning="confirmLoading">
      <div style="font-size: 16px; font-weight: 600; padding: 10px 0">{{ $t('接入参数') }}</div>
      <j-form-container>
        <a-form-model ref="form" :model="model" :rules="validatorRules" slot="detail">
          <a-row>
            <a-col :span="10">
              <a-form-model-item
                :label="$t('抖音AppKey')"
                :labelCol="labelCol"
                :wrapperCol="wrapperCol"
                prop="tiktokAppKey"
              >
                <a-input v-model="model.tiktokAppKey" :placeholder="$t('请输入抖音AppKey')"></a-input>
              </a-form-model-item>
            </a-col>
          </a-row>
          <a-row>
            <a-col :span="10">
              <a-form-model-item
                :label="$t('抖音AppSecret')"
                :labelCol="labelCol"
                :wrapperCol="wrapperCol"
                prop="tiktokAppSecret"
              >
                <a-input v-model="model.tiktokAppSecret" :placeholder="$t('请输入抖音AppSecret')"></a-input>
              </a-form-model-item>
            </a-col>
          </a-row>
          <a-row>
            <a-col :span="10">
              <a-form-model-item
                :label="$t('抖音店铺ID')"
                :labelCol="labelCol"
                :wrapperCol="wrapperCol"
                prop="tiktokPoiId"
              >
                <a-input v-model="model.tiktokPoiId" :placeholder="$t('请输入抖音店铺ID')"></a-input>
              </a-form-model-item>
            </a-col>
          </a-row>
          <a-row>
            <a-col :span="10">
              <a-row>
                <a-col :span="16" :offset="6">
                  <a-button type="primary" :disabled="confirmLoading" @click="submitForm" v-has="'BisSysParameterController:edit'">{{ $t('保存') }}</a-button>
                </a-col>
              </a-row>
            </a-col>
          </a-row>
        </a-form-model>
      </j-form-container>
      <div style="font-size: 16px; font-weight: 600; padding: 10px 0">{{ $t('核销限制') }}</div>
      <a-row style="padding-left: 16px">
        <a-col :span="24" style="margin-bottom: 10px; color: rgba(0, 0, 0, 0.85)"
          >{{ $t('每个会员每种套餐每日最大核销次数') }}：<a-input
            v-model="tiktokDayLimit.ivalue"
            style="width: 100px"
          /><span style="color: orange">{{ $t('（0表示不限制）') }}</span></a-col
        >
        <a-col :span="24" style="margin-bottom: 10px; color: rgba(0, 0, 0, 0.85)"
          >{{ $t('每个会员每种套餐总最大核销次数') }}：<a-input
            v-model="tiktokLimit.ivalue"
            style="width: 100px"
          /><span style="color: orange">{{ $t('（0表示不限制）') }}</span></a-col
        >
        <a-col :span="24">
          <a-button type="primary" @click="submitSet" v-has="'BisSysParameterController:edit'">{{ $t('保存') }}</a-button>
        </a-col>
      </a-row>
    </a-spin>
    <yarn-cert-modal ref="yarnModal" @ok="conSubmit" @close="getInfo"></yarn-cert-modal>
  </a-card>
</template>
<script>
import axios from 'axios'
import { getAction, httpAction } from '@/api/manage'
import YarnCertModal from '@/views/setting/modules/YarnCertModal'

export default {
  name: 'TikTokSetting',
  mixins: [],
  components: { YarnCertModal },
  data() {
    return {
      confirmLoading: false,
      model: {
        idKey: '',
        tiktokPoiId: '',
        secretKey: '',
        tiktokAppSecret: '',
        appKey: '',
        tiktokAppKey: '',
      },
      labelCol: {
        xs: { span: 24 },
        sm: { span: 6 },
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 14 },
      },
      validatorRules: {
        tiktokAppKey: [{ required: true, message: this.$t('请输入抖音AppKey') }],
        tiktokAppSecret: [{ required: true, message: this.$t('请输入抖音AppSecret') }],
        tiktokPoiId: [{ required: true, message: this.$t('请输入抖音店铺ID') }],
      },
      url: {
        list: '/bis/bisSysParameter/queryByName',
      },
      tiktokDayLimit: {
        name: 'tiktokDayLimit',
        ivalue: 0,
        comment: '日最大核销次数-美团',
      },
      tiktokLimit: {
        name: 'tiktokLimit',
        ivalue: 0,
        comment: '总最大核销次数-美团',
      },
    }
  },
  created() {
    this.getInfo()
    this.getInfo2()
  },
  methods: {
    getInfo() {
      axios.all([this.fun1(), this.fun2(), this.fun3()]).then(
        axios.spread((r1, r2, r3) => {
          if (r1.success) {
            this.model.idKey = r1.result.id
            this.model.tiktokPoiId = r1.result.svalue
          }
          if (r2.success) {
            this.model.secretKey = r2.result.id
            this.model.tiktokAppSecret = r2.result.svalue
          }
          if (r3.success) {
            this.model.appKey = r3.result.id
            this.model.tiktokAppKey = r3.result.svalue
          }
        })
      )
    },
    fun1() {
      return getAction('/bis/bisSysParameter/queryByName', { name: 'tiktokPoiId' })
    },
    fun2() {
      return getAction('/bis/bisSysParameter/queryByName', { name: 'tiktokAppSecret' })
    },
    fun3() {
      return getAction('/bis/bisSysParameter/queryByName', { name: 'tiktokAppKey' })
    },
    submitForm() {
      let that = this
      // 触发表单验证
      that.$refs.form.validate((valid) => {
        if (valid) {
          if (that.model.idKey || that.model.secretKey ||that.model.appKey) {
            that.$refs.yarnModal.edit()
            return
          }
          that.conSubmit()
        }
      })
    },
    conSubmit() {
      let that = this
      that.confirmLoading = true
      let httpurl = '/bis/bisSysParameter/saveBatch'
      let method = 'post'
      let query = []
      query.push({
        id: that.model.idKey ? that.model.idKey : '',
        name: 'tiktokPoiId',
        svalue: that.model.tiktokPoiId,
        comment: '抖音门店ID',
      })
      query.push({
        id: that.model.secretKey ? that.model.secretKey : '',
        name: 'tiktokAppSecret',
        svalue: that.model.tiktokAppSecret,
        comment: '抖音AppSecret',
      })
      query.push({
        id: that.model.appKey ? that.model.appKey : '',
        name: 'tiktokAppKey',
        svalue: that.model.tiktokAppKey,
        comment: '抖音AppKey',
      })
      httpAction(httpurl, query, method)
        .then((res) => {
          if (res.success) {
            that.$message.success(res.message)
            that.getInfo()
          } else {
            that.$message.warning(res.message)
          }
        })
        .finally(() => {
          that.confirmLoading = false
        })
    },
    fun4() {
      return getAction('/bis/bisSysParameter/queryByName', { name: 'tiktokDayLimit' })
    },
    fun5() {
      return getAction('/bis/bisSysParameter/queryByName', { name: 'tiktokLimit' })
    },
    getInfo2() {
      axios.all([this.fun4(), this.fun5()]).then(
        axios.spread((r1, r2) => {
          if (r1.success) {
            this.tiktokDayLimit = r1.result
          }
          if (r2.success) {
            this.tiktokLimit = r2.result
          }
        })
      )
    },
    submitSet() {
      let httpurl = '/bis/bisSysParameter/saveBatch'
      let method = 'post'
      let query = []
      if (!this.tiktokDayLimit.ivalue) {
        this.tiktokDayLimit.ivalue = 0
      }
      if (!this.tiktokLimit.ivalue) {
        this.tiktokLimit.ivalue = 0
      }
      query.push(this.tiktokDayLimit)
      query.push(this.tiktokLimit)
      httpAction(httpurl, query, method)
        .then((res) => {
          if (res.success) {
            this.$message.success(res.message)
            this.getInfo2()
          } else {
            this.$message.warning(res.message)
          }
        })
        .finally(() => {
          this.confirmLoading = false
        })
    },
  },
}
</script>